import React from 'react';
import TimeSeriesLabel from './TimeSeries';
import SingleChoiceLabel from './SingleChoice';
import MultipleChoiceLabel from './MultipleChoice';
import { LABEL_TYPES } from '../utils/constant';

interface ILabelProps {
  data: string[];
  current?: string | string[];
  type: string;
  onClick?: (lb: string, rgb?: string) => void;
}

const Label = (props: ILabelProps) => {
  const { data, current, type, onClick } = props;

  return (
    <>
      {/* TS类型 */}
      {type === LABEL_TYPES.TIME_SERIES && (
        <div style={{ padding: '5px 0' }}>
          <TimeSeriesLabel
            value={data}
            current={current}
            onClick={(lb: string, rgb: string) => {
              onClick && onClick(lb, rgb);
            }}
          />
        </div>
      )}
      {/* 单选类型 */}
      {type === LABEL_TYPES.SINGLE_CHOICES && (
        <div style={{ padding: '5px 0' }}>
          <SingleChoiceLabel
            value={data}
            current={current}
            onClick={(lb: string, rgb: string = '') => {
              onClick && onClick(lb, rgb);
            }}
          />
        </div>
      )}
      {/* 多选类型 */}
      {type === LABEL_TYPES.MULTIPLE_CHOICES && (
        <div style={{ padding: '5px 0' }}>
          <MultipleChoiceLabel
            value={data}
            current={current}
            onClick={(lb: string, rgb: string = '') => {
              onClick && onClick(lb, rgb);
            }}
          />
        </div>
      )}
    </>
  );
};

export default Label;
